<template>
    <CusInput v-model="inputText" :required="true" placeholder="请输入账户名" :validator="validatorFn">
        <template v-slot:label>
            <span>账户</span>
        </template>
    </CusInput>
    <CusInput v-model="password" type="password" placeholder="请输入密码">
        <template v-slot:label>
            <span>密码</span>
        </template>
    </CusInput>
</template>

<script>
import CusInput from './components/CusInput.vue';

export default {
  components: {
    CusInput
  },
  data() {
    return {
        inputText: '',
        password: ''
    }
  },
  methods: {
    validatorFn(value) {
        if (!value) {
            return '账户名不能为空';
        } else if (value.length < 6) {
            return '账户名长度不能小于6位';
        } else if (value.length > 16) {
            return '账户名长度不能大于16位';
        } else {
            return true;
        }
    }
  }
}
</script>